<template>
    <a-row :gutter="24">

        <a-col :span="18">
            <a-table :dataSource="dataSource" :columns="columns" :pagination="false" class="mb-2" bordered>
                <template #bodyCell="{ column, record, index }">
                    <template v-if="column.key === 'index'">
                        {{ index + 1 }}
                    </template>
                </template>
            </a-table>
        </a-col>
    </a-row>
</template>
<script setup>
const props = defineProps({
    id: {
        type: Number,
    }
})
const { id } = toRefs(props)

const columns = [
    {
        title: '序号',
        dataIndex: 'index',
        key: 'index',
    },

    {
        title: '文件名称',
        dataIndex: 'name',
        key: 'name',
    },

    {
        title: '文件类型',
        dataIndex: 'type',
        key: 'type',
    },
    {
        title: '文件大小',
        dataIndex: 'size',
        key: 'size',
    },
    {
        title: '创建者',
        dataIndex: 'createUser',
        key: 'createUser',
    },
    {
        title: '创建时间',
        dataIndex: 'careateDate',
        key: 'careateDate',
    },

]
const dataSource = [
    {
        key: '1',
        type: 'doc',
        name: '道路施工项目',
        size: '10MB',
        createUser: '张三',
        careateDate: '2024年2月1日'
    }, {
        key: '1',
        type: 'doc',
        name: '道路施工项目',
        size: '10MB',
        createUser: '张三',
        careateDate: '2024年2月1日'
    },
    {
        key: '1',
        type: 'doc',
        name: '道路施工项目',
        size: '10MB',
        createUser: '张三',
        careateDate: '2024年2月1日'
    },
    {
        key: '1',
        type: 'doc',
        name: '道路施工项目',
        size: '10MB',
        createUser: '张三',
        careateDate: '2024年2月1日'
    },

    {
        key: '1',
        type: 'doc',
        name: '道路施工项目',
        size: '10MB',
        createUser: '张三',
        careateDate: '2024年2月1日'
    },

    {
        key: '1',
        type: 'doc',
        name: '道路施工项目',
        size: '10MB',
        createUser: '张三',
        careateDate: '2024年2月1日'
    },

]
const getData = (id) => {
    console.log("fatch code", id)
}
watch(id, () => {
    getData(id.value);
});



</script>

 